<!DOCTYPE HTML>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>用户登录</title>
    <link th:href="@{/css/bootstrap.css}" rel='stylesheet' type='text/css'/>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <!-- Custom Theme files -->
    <link th:href="@{/css/style.css}" rel='stylesheet' type='text/css'/>
    <!-- Custom Theme files -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type="application/x-javascript"> addEventListener("load", function () {
        setTimeout(hideURLbar, 0);
    }, false);

    function hideURLbar() {
        window.scrollTo(0, 1);
    } </script>
    <!--webfont-->
    <script type="text/javascript" th:src="@{/js/jquery-1.11.1.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/login.js}"></script>
    <style>
        .single-bottom button {
            border: none;
            font-size: 1.1em;
            width: 13%;
            margin: 0.5em 0em;
            background: #F19E1F;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            color: #fff;
            padding: 0.5em 1em;
            outline: none;
        }

        .single-bottom input[type="password"] {
            font-size: 1em;
            width: 98%;
            padding: 0.5em 1em;
            margin: 0.5em 0;
            background: #fff;
            outline: none;
            border: 1px solid #bbb;
            color: #bbb;
        }
    </style>
</head>
<body>
<div class="header">
    <div class="col-sm-8 header-left">
        <div class="logo">
            <a th:href="@{/index}"><img th:src="@{/images/logo.png}" alt=""/></a>
        </div>
        <div class="menu">
            <a class="toggleMenu" href="javascript:void(0);"><img th:src="@{/images/nav.png}" alt=""/></a>
            <ul class="nav" id="nav">
                <li><a href="/source">旅游资源</a></li>
                <li><a href="/service">服务设施</a></li>
                <li><a href="/shop">购物信息</a></li>
                <li class="active">
                    <a th:if="${session.user == null}" href="/tologin">登录</a>
                    <a th:if="${session.user != null}" href="/order">我的预定</a>
                </li>
                <li>
                    <a th:if="${session.user == null}" href="/toregist">注册</a>
                    <a th:if="${session.user != null}" th:href="@{/logout}">退出</a>
                </li>
                <div class="clearfix"></div>
            </ul>
            <script type="text/javascript" th:src="@{/js/responsive-nav.js}"></script>
        </div>
    </div>
    <div class="col-sm-4 header_right">
        <div id="loginContainer">
            <a href="javascript:void(0);" id="loginButton">
                <img th:src="@{/images/login.png}">
                <a th:if="${session.user == null}" th:href="@{/tologin}" style="font-size: 14px;color: #ffffff">未登录</a>
                <span th:if="${session.user != null}" th:text="${session.user.u_name}">未登录</span>
            </a>
        </div>
        <div class="clearfix"></div>
    </div>
    <div class="clearfix"></div>
</div>
<div class="page-not-found">
    <div class="row">
        <div class="single-bottom col-md-offset-3" style="width: 600px;">
            <h3>用户登录</h3>
            <form action="/login" method="post" onsubmit="return checkForm();">
                <span th:text="${message}" style="padding-left: 220px;font-size: 13px;color: red"></span>
                <div class="col-md-12">
                    <span style="color: #7b3000">用户名：</span>
                    <input name="u_name" type="text" th:value="${u_name}" placeholder="请输入用户名"/>
                </div>
                <div class="col-md-12">
                    <span style="color: #7b3000">密码：</span></br>
                    <input name="u_password" type="password" placeholder="请输入密码"/>
                </div>
                <div class="clearfix"></div>
                <button type="submit" style="margin-left: 100px">登 录</button>
                <a href="/toregist" style="margin-left: 30px;font-size: 14px">去注册</a>
            </form>
        </div>
    </div>
</div>
<div th:include="footer :: th_footer"></div>
<script type="text/javascript">

    $("#sub_form").click(function () {
        var u_name = $('input[name="u_name"]').val();
        var u_password = $('input[name="u_password"]').val();

        if (u_name.trim().length > 3 && u_password.trim().length > 3) {
            return true;
        } else {
            alert("所有字段需大于三位！");
            return false;
        }
    });

</script>
</body>
</html>		